<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>电子邮箱验证</title>
	</head>
	<script src="../js/jquery-3.2.1.min.js"></script>
	<script>
		$(function(){
			$("form").submit(function(){
				var mail=$("#email :text").val();
				if(mail==""){
					alert("邮箱不能为空！");
					$("#email :text").focus();	
					return false;
				}
				if(mail.indexOf("@")==-1||mail.indexOf(".")==-1){
					alert("邮箱必须包含@和.字符");
					$("#email :text").select();
					return false;
				}
				return true;
			});
			$("#email :text").focus(function(){
				if($(this).val()=="请输入正确的邮箱"){
					$(this).val("");
					$(this).css("border","1px solid #ff0000");
				}
			});
		});
	</script>
	<body>
		<form method="get" action="taobao.html">
			<p id="email">
				电子邮箱：<input type="text" name="email" value="请输入正确的邮箱"/>(必须包含@和.字符)
			</p>
			<p>
				性别：<input type="radio" name="gender" value"male" />男<input type="radio" name="gender" value"female" />女
			</p>
			<p>
				<input type="submit" name="submit" value="提交"/>
			</p>
		</form>
	</body>
</html>